<template>
  <page-container class="graph-container" :fullScreen="true">
    <a-spin :spinning="spinning" style="height: 100%">
      <iframe src="graph/company.html" frameborder="0" width="100%" height="100%"></iframe>
      <police-list-drawer
        v-model:visible="drawerVisible"
        title="警情"
        portionUrl="/series/detail/queryCaseList"
        :params="policeDrawerParams"
      ></police-list-drawer>
    </a-spin>
  </page-container>
</template>

<script lang="ts">
import { defineComponent, onMounted, ref, onUnmounted } from 'vue';
import PoliceListDrawer from '@/components/police-list-drawer/index.vue';
export default defineComponent({
  name: 'studyJudgeList',
  setup() {
    const spinning = ref(false);
    function handle(event) {
      //此处执行事件
      //   console.log('event', event.data);
      if (event.data.loading) {
        spinning.value = event.data.state;
        return false;
      }
      drawerVisible.value = true;
      if (event.data.source) {
        const source = event.data.source.split('_')[1];
        const target = event.data.target.split('_')[1];
        policeDrawerParams.value.inputParams = `${source}&${target}`;
        policeDrawerParams.value.featureValue = '';
        policeDrawerParams.value.sourceFeature = source;
        policeDrawerParams.value.targetFeature = target;
      } else {
        policeDrawerParams.value.inputParams = event.data.label;
        policeDrawerParams.value.featureValue = event.data.label;
        policeDrawerParams.value.sourceFeature = '';
        policeDrawerParams.value.targetFeature = '';
      }
    }
    onMounted(() => {
      window.addEventListener('message', handle);
    });
    onUnmounted(() => {
      window.removeEventListener('message', handle);
    });

    const drawerVisible = ref<boolean>(false);
    const policeDrawerParams = ref<any>({
      callTimeStart: '', // 开始时间
      callTimeEnd: '', // 结束时间
      callSummaryCodes: '', //接警类别
      dealSummaryCodes: '', //反馈类别
      xqdwCodes: '', //辖区单位
      classifyCodes: '', // 智能分类
      featureCode: '',
      featureValue: '',
      sourceFeature: '',
      targetFeature: '',
      page: 1,
      size: 10,
      inputParams: '',
      caseNos: '',
    });

    return {
      drawerVisible,
      policeDrawerParams,
      spinning,
    };
  },
  components: {
    PoliceListDrawer,
  },
});
</script>

<style lang="less" scoped>
.graph-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  height: 100%;
  :deep(.ant-spin-nested-loading) {
    z-index: 999;
    width: 100%;
    height: 100%;
  }
  :deep(.ant-spin-container) {
    height: 100%;
  }
}
</style>
